import React from 'react';
import {IRouteComponentProps} from 'umi-types';
import styles from './index.less';

interface IArticleProps {
    url: string,
    [key: string]: any;
}
function Article (props: IArticleProps) {
    
    return (
        <li>
            <div className={styles.article_title}>全国教育工作会议召开，传递这些重要信息！</div>
            <div className={styles.article_info}>
                <div className={styles.article_info_body}>
                    <p>1月7日至8日，2021年全国教育工作会议在京召开。会议强调，要加大调控部门监管力度，积极应对广大群众朋友们的需求</p>
                    <span>2021-03-08 </span>
                </div>
                <div className={styles.article_pic}>
                    <img src={props.url} alt=""/>
                </div>
            </div>
        </li>
    );
}
function articles(props: IRouteComponentProps) {
    const urls = [
        'http://p26.toutiaoimg.com/img/tos-cn-i-0004/7868ed9a8b434dd1a6917cc4a8c2a906~tplv-tt-cs0:640:360.jpg',
        'http://p6.toutiaoimg.com/img/pgc-image/STJ5H7V85r4cFR~tplv-tt-cs0:640:360.jpg',
        'https://p3.pstatp.com/list/pgc-image/SUQa82OB7I9u0z',
        'http://p5.toutiaoimg.com/img/pgc-image/f4cac4b20c184f9689f503cf9c2908e7~tplv-tt-cs0:640:360.jpg',
    ];

    return (
        <ul className={styles.articles}>
            {urls.map(_ => <Article url={_}/>)}
        </ul>
    );
}

export default articles;